<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>javascript 阶段</title>
    <link rel="stylesheet" href="main.css">
    <script src="./main.js"></script>
</head>
<body>

    <!-- 表单元素的初始化... -->
    <!-- 单标签 -->
    <!-- <input type="text" value="hello world">   -->
    <!-- 双标签 -->
    <!-- <textarea> hello world </textarea> -->


    <div class="wrapper">
        <div class="message-top">
            <!-- 输入域 -->
            <div><textarea class="message-top-text" placeholder="请写下您此刻心情"></textarea></div>
            <!-- 按钮 -->
            <div><button class="message-top-btn">发布</button></div>
        </div>
        <div class="message-bottom">
            <!-- 列表区域 -->
            <ul class="message-bottom-list">
                <!-- 
                    <li>
                        <p>今天天气甚好</p> 
                        <button class="btn-delete">删除</button>
                    </li> 
                -->
            </ul>
        </div>
    </div>

    <script>
        // 需求：
            // 1、点击”发布“按钮获取输入域的内容
            // 2、把输入域的内容渲染在列表区域，重置输入域的值
            // 3、点击列表项的”删除“按钮，就可以删除当前的列表项
    </script>
</body>
</html>